<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>空值合并运算符 '??'</title>
  </head>
  <body>
    <script>
      // a 变量值为 null/undefined  a ?? b 返回 b
      let user;
      console.log(user ?? "user未定义");
      console.log(user ? user : "user未定义");

      let userTow = "我是userTow，已定义";
      console.log(userTow ?? "userTow未定义");
      console.log(userTow ? userTow : "userTow未定义");

      // 显示第一个已定义的值   与三元运算符
      let firstName = null; // 填写空字符串，会显示空字符串
      let lastName = null;
      let nickName = "孙悟空";
      console.log(firstName ?? lastName ?? nickName ?? "匿名"); // 孙悟空
      console.log(firstName || lastName || nickName || "匿名"); // 孙悟空
      // 它们之间重要的区别是：
      // || 返回第一个 真值。
      // ?? 返回第一个 已定义的值。

      let height = 0;

      console.log(height || 100); // 100
      console.log(height ?? 100); // 0

      //   出于安全原因，JavaScript 禁止将 ?? 运算符与 && 和 || 运算符一起使用，除非使用括号明确指定了优先级
      // let x = 1 && 2 ?? 3; // Syntax error
    </script>
  </body>
</html>
